<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>利用vertical-align实现图片文字垂直居中对齐</title>
    <style>
      img {
        width: 250px;
        /* 底部对齐 */
        /* vertical-align: bottom; */
        /* 让图片和文字垂直居中 */
        vertical-align: middle;
        /* 顶部对齐 */
        /* vertical-align: top; */
      }
      textarea {
        vertical-align: middle;
      }
    </style>
  </head>
  <body>
    <img src="images/emoji.jpg" alt="" /> emoji表情~

    <br />
    <textarea name="" id="" cols="30" rows="10"></textarea> 请您留言
  </body>
</html>
